<template>
  <el-form :model="ruleForm" ref="ruleForm" :rules="rules" :class="isEdit?'':'formItem'"
           :label-position="labelPosition">
    <!--出险 -->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <span class="header-card-title">维修信息</span>
      </div>
      <el-row :gutter="24">
        <el-col :span="8" v-if="isShow">
          <el-form-item label="维修类别:">
            <el-radio-group v-model="ruleForm.maintenanceType">
              <el-radio label="3">出险</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="8" v-if="isShow">
          <el-form-item label="理赔类别:" prop="settlementType">
            <el-radio-group v-if="isEdit" v-model="ruleForm.settlementType">
              <el-radio label="1">实物赔付申请</el-radio>
              <el-radio label="2">理赔款支付申请</el-radio>
            </el-radio-group>
            <span v-else>
              <span v-if="ruleForm.settlementType === '1'">实物赔付申请</span>
               <span v-if="ruleForm.settlementType === '2'">理赔款支付申请</span>
            </span>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="24">
        <el-col :span="8">
          <el-form-item label="被保险人:" v-if="isShow">
            <el-input v-if="isEdit" v-model="ruleForm.insuredName" placeholder="输入被保险人"></el-input>
            <span v-else>{{ ruleForm.insuredName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="驾驶员:" v-if="isShow">
            <el-input v-if="isEdit" v-model="ruleForm.driverName" placeholder="输入驾驶员"></el-input>
            <span v-else>{{ ruleForm.driverName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="责任类型:" v-if="isShow">
            <el-select v-model="ruleForm.responsibilityType" placeholder="选择责任类型" style="width: 100%;"
                       @change="handleResponsibilityType"
                       v-if="isEdit">
              <el-option v-for="item in dict.type.responsibility_type" :key="item.value" :label="item.label"
                         :value="item.value">
              </el-option>
            </el-select>
            <span v-else>{{ handleCcomputed(dict.type.responsibility_type, ruleForm.responsibilityType) }}</span>

          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="责任人单位名称:" v-if="isShow">
            <el-input v-if="isEdit" v-model="ruleForm.responsibleUnitName"
                      placeholder="输入责任人单位名称"></el-input>
            <span v-else>{{ ruleForm.responsibleUnitName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="事故类型:" v-if="isShow">
            <el-select v-model="ruleForm.accidentType" placeholder="选择事故类型" style="width: 100%;"
                       v-if="isEdit" @change="handleAccidentType">
              <el-option v-for="item in dict.type.accident_type" :key="item.value" :label="item.label"
                         :value="item.value">
              </el-option>
            </el-select>
            <span v-else>{{ selectDictLabel(dict.type.accident_type, ruleForm.accidentType) }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="出险地点:" v-if="isShow">
            <el-input v-if="isEdit" v-model="ruleForm.accidentLocation" placeholder="输入出险地点"></el-input>
            <span v-else>{{ ruleForm.accidentLocation }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否有人伤:" v-if="isShow">
            <el-select v-model="ruleForm.humanInjury" placeholder="选择是否有人伤" style="width: 100%;"
                       v-if="isEdit">
              <el-option label="是" value="1"></el-option>
              <el-option label="否" value="2"></el-option>
            </el-select>
            <span v-else>{{
                ruleForm.humanInjury == "1" ? '是' : ruleForm.humanInjury ==
                "2" ? '否' : ''
              }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="出险日期:" prop="accidentTime" v-if="isShow">
            <el-date-picker type="date" v-model="ruleForm.accidentTime" v-if="isEdit" value-format='yyyy-MM-dd'
                            @change="handleAccidentTime" style="width: 100%;" placeholder="选择出险日期">
            </el-date-picker>
            <span v-else>{{ ruleForm.accidentTime }}</span>

          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="报案时间:" v-if="isShow">
            <el-date-picker type="datetime" v-model="ruleForm.reportingCaseTime" v-if="isEdit"
                            value-format='yyyy-MM-dd HH:mm:ss' style="width: 100%;" placeholder="选择报案时间">
            </el-date-picker>
            <span v-else>{{ ruleForm.reportingCaseTime }}</span>

          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="预计维修开始时间:" prop="expectStartTime" v-if="isShow">
            <el-date-picker type="date" v-model="ruleForm.expectStartTime" v-if="isEdit"
                            value-format='yyyy-MM-dd' style="width: 100%;" placeholder="选择预计维修开始时间">
            </el-date-picker>
            <span v-else>{{ ruleForm.expectStartTime }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="预计维修结束时间:" prop="expectEndTime" v-if="isShow">

            <el-date-picker type="date" v-model="ruleForm.expectEndTime" v-if="isEdit"
                            value-format='yyyy-MM-dd' style="width: 100%;" placeholder="选择预计维修结束时间">
            </el-date-picker>
            <span v-else>{{ ruleForm.expectEndTime }}</span>

          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="交强险保单号:" v-if="isShow" prop="compulsoryPolicyNum">
            <el-input v-if="isEdit" v-model="ruleForm.compulsoryPolicyNum"
                      placeholder="输入交强险保单号"></el-input>
            <span v-else>{{ ruleForm.compulsoryPolicyNum }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="商业险保单号:" prop="commercialPolicyNum" v-if="isShow">
            <el-input v-if="isEdit" v-model="ruleForm.commercialPolicyNum"
                      placeholder="输入交强险保单号"></el-input>
            <span v-else>{{ ruleForm.commercialPolicyNum }}</span>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="报案号:" prop="reportingCaseNum">
            <el-input v-model="ruleForm.reportingCaseNum" v-if="isEdit" placeholder="请输入报案号"/>
            <span v-else>{{ ruleForm.reportingCaseNum }}</span>
          </el-form-item>
        </el-col>
      </el-row>

      <!--      <el-row :gutter="24">-->
      <!--        <el-col v-if="isShow">-->
      <!--          <el-form-item label="定损单:" prop="lossAssessmentUrl">-->
      <!--            <image-common v-model="ruleForm.lossAssessmentUrl" :limit="20" :disabled="!isEdit" :upType="2"/>-->
      <!--          </el-form-item>-->
      <!--        </el-col>-->
      <!--      </el-row>-->

    </el-card>
    <!-- 主车定损 -->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <span class="header-card-title">主车定损</span>
      </div>
      <el-row :gutter="24">
        <el-col :span="8">
          <el-form-item label="主车定损金额:" v-if="isShow">
            <el-input v-if="isEdit" v-model="ruleForm.vehicleAssessmentPrice" placeholder="输入主车定损金额"
                      @change="changeAmount('vehicleAssessmentPrice')"></el-input>
            <span v-else>{{ ruleForm.vehicleAssessmentPrice }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="人伤金额:" prop="persionAssessmentPrice" v-if="isShow">
            <el-input v-if="isEdit" v-model="ruleForm.persionAssessmentPrice"
                      placeholder="输入物损金额"
                      :disabled="Number(ruleForm.humanInjury) === 2"
                      @change="changeAmount('persionAssessmentPrice')"></el-input>
            <span v-else>{{ ruleForm.persionAssessmentPrice }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="其他金额:" prop="otherAssessmentPrice" v-if="isShow">
            <el-input v-if="isEdit" v-model="ruleForm.otherAssessmentPrice" placeholder="输入其他金额"
                      @change="changeAmount('otherAssessmentPrice')"></el-input>
            <span v-else>{{ ruleForm.otherAssessmentPrice }}</span>
          </el-form-item>
        </el-col>

        <el-col :span="8">
          <el-form-item label="定损总计:" v-if="isShow">
            <el-input v-if="isEdit" v-model="ruleForm.assessmentTotalPrice" placeholder="输入定损总计"
                      disabled></el-input>
            <span v-else>{{ ruleForm.assessmentTotalPrice }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="签约维修厂/维修厂:" prop="maintenanceShopId" v-if="isShow">
            <el-select v-if="isEdit" v-model="ruleForm.maintenanceShopId" @change="handleChange" style="width: 100%"
                       placeholder="请选择输入维修厂">
              <el-option v-for="item in options" :key="item.supplierId"
                         :label="item.supplierName" :value="item.supplierId"/>
            </el-select>
            <span v-else>{{ ruleForm.maintenanceShop }}</span>
          </el-form-item>
        </el-col>

      </el-row>
      <el-row :gutter="24">
        <el-col>
          <el-form-item label="事故照片:" prop="accidentPhotos" v-if="isShow">
            <ImageUpload v-model="ruleForm.accidentPhotos" :limit="20" v-if="isEdit"/>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col>
          <el-form-item label="定损单:" prop="lossAssessmentOss" v-if="isShow">
            <image-common v-model="ruleForm.lossAssessmentOss" :limit="20" :disabled="!isEdit" :upType="2"/>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>
    <!--三者定损 -->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <div style="display: flex;justify-content: space-between;width: 100%">
          <span class="header-card-title">保险公司定损额（三者）</span>
        </div>
      </div>
      <el-row :gutter="24" style="margin-bottom: 16px;">
        <el-col v-if="isShow">
          <el-table size="mini" :data="ruleForm.threeLossAssessmentDtoList" border style="width: 100%"
                    :header-cell-class-name="headerClass">

            <el-table-column align="center" label="操作" width="68"
                             v-if="ruleForm.threeLossAssessmentDtoList.length > 1 && isEdit"
                             fixed="right">
              <template #default="{row,$index}">
                <el-button size="mini" type="danger" @click="delThreeLoss(row, $index)">删除</el-button>
              </template>
            </el-table-column>
            <el-table-column type="index" width="55" align="center" label="序号"/>
            <el-table-column align="center" label="人伤金额" min-width="140" prop="personPrice">
              <template #default="{row,$index}">
                <el-form-item
                    class="formTable"
                    :prop="'threeLossAssessmentDtoList.'+$index+'.personPrice'"
                    :rules="{required: requiredTable,  trigger: 'blur'}"
                >
                  <el-input v-model="row.personPrice" v-if="isEdit" size="mini"
                            @change="changeThreeLoss(row, $index, 'personPrice')"></el-input>
                  <span v-else>{{ row.personPrice }}</span>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column align="center" label="施救费用" min-width="140" prop="rescueCost">
              <template #default="{row,$index}">
                <el-form-item
                    class="formTable"
                    :prop="'threeLossAssessmentDtoList.'+$index+'.rescueCost'"
                    :rules="{required: requiredTable,  trigger: 'blur'}"
                >
                  <el-input v-model="row.rescueCost" v-if="isEdit" @change="changeThreeLoss(row, $index, 'rescueCost')"
                            size="mini"></el-input>
                  <span v-else> {{ row.rescueCost }}</span>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column align="center" label="物损金额" min-width="140" prop="damagePrice">
              <template #default="{row,$index}">
                <el-form-item
                    class="formTable"
                    :prop="'threeLossAssessmentDtoList.'+$index+'.damagePrice'"
                    :rules="{required: requiredTable,  trigger: 'blur'}"
                >
                  <el-input v-model="row.damagePrice" v-if="isEdit"
                            @change="changeThreeLoss(row, $index, 'damagePrice')" size="mini"></el-input>
                  <span v-else>{{ row.damagePrice }}</span>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column align="center" label="三者定损金额" min-width="140" prop="otherAssessmentPrice">
              <template #default="{row,$index}">
                <el-form-item
                    class="formTable"
                    :prop="'threeLossAssessmentDtoList.'+$index+'.otherAssessmentPrice'"
                    :rules="{required: requiredTable,  trigger: 'blur'}"
                >
                  <el-input v-model="row.otherAssessmentPrice" v-if="isEdit"
                            @change="changeThreeLoss(row, $index, 'otherAssessmentPrice')" size="mini"></el-input>
                  <span v-else>{{ row.otherAssessmentPrice }}</span>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column align="center" label="三者车牌号" min-width="140" prop="otherCarNo">
              <template #default="{row,$index}">
                <el-form-item
                    class="formTable"
                    :prop="'threeLossAssessmentDtoList.'+$index+'.otherCarNo'"
                    :rules="{required: requiredTable,  trigger: 'blur'}"
                >
                  <el-input v-model="row.otherCarNo" v-if="isEdit" size="mini"></el-input>
                  <span v-else>{{ row.otherCarNo }}</span>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column align="center" label="其他" min-width="140" prop="threeOther">
              <template #default="{row}">
                <el-input v-model="row.threeOther" v-if="isEdit" size="mini"></el-input>
                <span v-else>
                    {{ row.threeOther }}
                  </span>
              </template>
            </el-table-column>
            <template v-slot:append v-if="ruleForm.accidentType == 3 && isEdit">
              <div class="flex-xy-center" style="height: 30px">
                <e-button type="text" @click="addThreeLoss">
                  新增
                </e-button>
              </div>
            </template>
          </el-table>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col v-if="isShow">
          <el-form-item label="上传附件:">
            <image-common v-model="ruleForm.maintenanceProjectUrl" :limit="20" :disabled="!isEdit" :upType="2"/>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>

    <!-- 其他费用 -->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <span class="header-card-title">其他费用</span>
      </div>
      <el-row :gutter="24">

        <el-col :span="8">
          <el-form-item label="其他费用:" v-if="isShow" prop="otherPrice">
            <el-input v-if="isEdit" v-model="ruleForm.otherPrice"
                      @change="changeAmount('otherPrice')"
                      placeholder="输入其他费用"></el-input>
            <span v-else>{{ ruleForm.otherPrice }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="其他费用产生原因:" v-if="isShow" prop="otherCostReason">
            <el-input v-if="isEdit" v-model="ruleForm.otherCostReason" placeholder="输入其他费用产生原因"></el-input>
            <span v-else>{{ ruleForm.otherCostReason }}</span>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row :gutter="24">
        <el-col>
          <el-form-item label="其他费用产生附件:" v-if="isShow" prop="otherCostUrl">
            <image-common v-model="ruleForm.otherCostUrl" :limit="20" :disabled="!isEdit" :upType="2"/>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>
    <!-- 出险相关信息 -->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <span class="header-card-title">出险相关信息</span>
      </div>
      <el-row :gutter="24">
        <el-col :span="8">
          <el-form-item label="是否个人垫付:" v-if="isShow">
            <el-select v-model="ruleForm.advancePayment" placeholder="选择是否个人垫付" style="width: 100%;"
                       v-if="isEdit">
              <el-option label="是" :value="1"></el-option>
              <el-option label="否" :value="2"></el-option>
            </el-select>
            <span v-else>{{
                ruleForm.advancePayment == "1" ? '是' : ruleForm.advancePayment == "2" ? '否' : ''
              }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="个人垫付费用:"
                        v-if="isShow && ruleForm.advancePayment == '1'">
            <el-input v-if="isEdit" v-thousand
                      v-model="ruleForm.advancePaymentCost" placeholder="输入个人垫付费用"></el-input>
            <span v-else>{{ format_thousand(ruleForm.advancePaymentCost) }}</span>
          </el-form-item>
        </el-col>
      </el-row>


      <el-row :gutter="24">
        <el-col>
          <el-form-item label="备注:" prop="assessmentRemark" v-if="isShow">
            <el-input v-if="isEdit" placeholder="输入备注" type="textarea" :rows="4"
                      v-model="ruleForm.assessmentRemark"></el-input>
            <span v-else>{{ ruleForm.assessmentRemark }}</span>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>
    <!--收取加速折旧费-->
    <el-card class="box-card" shadow="never">
      <div slot="header" class="header-card">
        <span class="header-card-title">收取加速折旧费</span>
      </div>
      <el-row :gutter="24">
        <el-col :span="8">
          <el-form-item label="加速折旧费方案:" v-if="isShow">
            <el-input v-if="isEdit" v-model="ruleForm.depreciationPlan" disabled
                      placeholder="加速折旧费方案"/>
            <span v-else>
              {{ ruleForm.depreciationPlan == '1' ? '是' : '否' }}
            </span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="加速折旧费金额:">
            <el-input v-model="ruleForm.depreciationPrice"
                      v-if="isEdit" v-thousand disabled
                      @change="changeAmount('depreciationPrice')"
                      placeholder="加速折旧费金额"/>
            <span v-else>{{ format_thousand(ruleForm.depreciationPrice) }}</span>
          </el-form-item>
        </el-col>
      </el-row>
    </el-card>


  </el-form>
</template>

<script>
import {effectDate} from "@/utils/libs/effectDate.js"
import {getInsuranceSelectList, getDepreciationRule} from "@/api/cwgd/insuranceSelect";
import {
  getInsuranceTime,
} from "@/api/bxlp/settlement.js";

export default {
  dicts: ["accident_type", "responsibility_type"],
  name: "beinDangerRepair",//出险维修
  model: {
    prop: 'detailForm',
    event: 'update:detailForm',
  },

  props: {
    detailForm: {
      type: Object,
      default: {},
    },
    state: {
      type: String,
      default: "",
    },
  },
  computed: {
    handleCcomputed() {
      return function (objData, val) {
        let label = ''
        let index = objData.findIndex(a => a.value == val)
        if (index !== -1) {
          label = objData[index].label
        }
        return label
      }
    },
    ruleForm: {
      get() {
        let that = this
        const proxy = new Proxy(that.detailForm, {
          get(target, key) {
            return Reflect.get(target, key)
          },
          set(target, key, value) {
            if (value) {
              that.handleClearValidate(key)
            }
            that.$emit('update:detailForm', {...target, [key]: value})
            return true
          }
        })
        return proxy
      }
    },
    labelPosition() {
      if (this.isEdit) {
        return "top";
      } else {
        return "lef";
      }
    },
    isEdit() {
      let bool;
      switch (this.state) {
        case "write":
          bool = true;
          break;
        case "disabled":
          bool = false;
          break;
        case "readonly":
          bool = false;
          break;
      }
      return bool
    },
  },
  data() {
    var start = (rule, value, callback) => {
      let that = this
      effectDate(rule, value, callback,
          that.ruleForm.expectStartTime,
          that.ruleForm.expectEndTime,
          '预计维修开始时间',
          '预计开维结束时间'
      )
    };
    var end = (rule, value, callback) => {
      let that = this
      effectDate(rule, value, callback,
          that.ruleForm.expectStartTime,
          that.ruleForm.expectEndTime,
          '预计维修开始时间',
          '预计开维结束时间'
      )
    };
    return {
      isShow: true,
      headerCarMaintenanceProjectList: ['maintenanceName', 'price', 'materialCost', 'laborCost',],
      headerThreeLossAssessmentDtoList: ['personPrice', 'rescueCost', 'damagePrice', 'otherAssessmentPrice', 'otherCarNo'],
      rules: {
        //出险
        expectStartTime: [{required: this.isEdit, validator: start, trigger: 'change'}],
        expectEndTime: [{required: this.isEdit, validator: end, trigger: 'change'}],
        accidentTime: [{required: this.isEdit, message: '请选择出险日期', trigger: 'change'}],
        compulsoryPolicyNum: [{required: this.isEdit, message: '请输入交强险保单号', trigger: 'blur'}],
        commercialPolicyNum: [{required: this.isEdit, message: '请输入商业险保单号', trigger: 'blur'}],
        reportingCaseNum: [{required: this.state === 'write', message: '请输入报案号', trigger: 'blur'}],

        //维修类型 一般维修
        maintenanceShop: [{required: this.isEdit, message: '请输入签约保养厂/保养厂', trigger: 'blur'}],
        faultPhenomenon: [{required: this.isEdit, message: '请输入故障现象', trigger: 'blur'}],
        maintenanceFaultDiagnosis: [{required: this.isEdit, message: '请输入维修厂故障诊断', trigger: 'blur'}],
        maintenanceQuoter: [{required: this.isEdit, message: '请输入维修厂报价', trigger: 'blur'}],
        reasonForClaim: [{required: this.isEdit, message: '请选择是否符合索赔理由', trigger: 'change'}],
        comprehensiveRecommendations: [{required: this.isEdit, message: '请输入综合建议方案', trigger: 'blur'}],

        maintenanceProjectUrl: [{required: this.isEdit, message: '请选择定损单', trigger: 'change'}],

        //保险公司定损额
        // assessmentTotalPrice: [{required: this.isEdit, message: '请输入定损总计', trigger: 'blur'}],
        // vehicleAssessmentPrice: [{required: this.isEdit, message: '请输入主车定损金额', trigger: 'blur'}],
        // residualValue: [{required: this.isEdit, message: '请输入拍卖公司残值', trigger: 'blur'}],
        // auctionCompanyName: [{required: this.isEdit, message: '请输入拍卖公司名称', trigger: 'blur'}],
        // residualUrl: [{required: this.isEdit, message: '请选择定损单', trigger: 'change'}],

      },
      requiredTable: false,
      options: []
    };
  },
  created() {
    this.handleList()
  },
  mounted() {
  },
  methods: {
    handleList() {
      getInsuranceSelectList({businessTypeCode: '4'}).then(res => {
        if (res.code === 200) {
          this.options = res.data
        }
      })
    },

    handleAccidentTime(val) {
      if (val) {
        let obj = {
          settlementDate: val,
          carId: this.ruleForm.carId,
        };
        getInsuranceTime(obj).then((res) => {
          if (res) {
            if (res.jqxPolicyCode) {
              this.$set(this.value, 'compulsoryPolicyNum', res.jqxPolicyCode)
            }
            if (res.syxPolicyCode) {
              this.$set(this.value, 'commercialPolicyNum', res.syxPolicyCode)
            }
          }
        });
      }
    },

    handleChange(val) {
      this.value.maintenanceShopId = val
      this.value.maintenanceShop = this.options.find(item => item.supplierId === val).supplierName
    },

    headerClass({row, column, rowIndex, columnIndex}) {
      for (let i = 0; i < row.length; i++) {
        if (this.headerCarMaintenanceProjectList.includes(row[i].property) && i == columnIndex) {
          return 'header-class'
        }
      }
      for (let i = 0; i < row.length; i++) {
        if (this.headerThreeLossAssessmentDtoList.includes(row[i].property) && i == columnIndex && this.requiredTable) {
          return 'header-class'
        }
      }
    },

    handleResponsibilityType(val) {
      if (this.ruleForm.accidentType === "2" && val != 1) {
        this.requiredTable = true;
      } else {
        this.requiredTable = false;
      }
    },

    //事故类型事件
    handleAccidentType(val) {
      if (val === "2" && val.ruleForm.responsibilityType != 1) {
        this.requiredTable = true;
      } else {
        this.requiredTable = false;
      }
    },

    //新增
    addDecoration() {
      let obj = {
        maintenanceName: "",
        price: "",
        materialCost: "",
        laborCost: "",
        partNumber: "",
        maintBrand: "",
        maintModel: "",
        maintNum: "",

        detailedInfo: "",
        disabled: true,
      }
      this.ruleForm.carMaintenanceProjectList.push(obj)
    },

    delDecoration(row, key) {
      this.ruleForm.carMaintenanceProjectList.splice(key, 1)
    },

    //新增保险公司定损额（三者）
    addThreeLoss() {
      let obj =
          {
            personPrice: "",
            rescueCost: "",
            damagePrice: "",
            otherAssessmentPrice: "",
            otherCarNo: "",
            threeOther: "",

          }
      this.ruleForm.threeLossAssessmentDtoList.push(obj)
    },

    delThreeLoss(row, key) {
      this.ruleForm.threeLossAssessmentDtoList.splice(key, 1)

    },

    changeAmount(str) {
      let msg = /^(?:[1-9]\d*|0)(?:\.\d+)?$/
      if (!msg.test(this.ruleForm[str])) {
        this.ruleForm[str] = ""
      } else {
        this.ruleForm[str] = this.ruleForm[str].toString().match(/^\d+(?:\.\d{0,2})?/)[0]
        this.sumPrice()

      }
      if (str === 'vehicleAssessmentPrice') {
        getDepreciationRule({vehicleAssessmentPrice: this.value[str]}).then(res => {
          if (res.code === 200) {
            this.$set(this.value, 'depreciationPlan', res.data?.depreciationPlan)
            this.$set(this.value, 'depreciationPrice', Number(res.data?.depreciationPrice) || 0)
          }
        })
      }
    },

    //定损总计
    sumPrice() {
      let num = 0
      if (this.ruleForm.maintenanceType === '1') {
        num = Number(this.ruleForm.vehicleAssessmentPrice) + Number(this.ruleForm.residualValue) + Number(this.ruleForm.carOther)
      }
      if (this.ruleForm.maintenanceType === '3') {
        num = Number(this.ruleForm.vehicleAssessmentPrice) + Number(this.ruleForm.v) + Number(this.ruleForm.otherAssessmentPrice)
      }
      this.ruleForm.assessmentTotalPrice = num.toString().match(/^\d+(?:\.\d{0,2})?/)[0]

    },

    changeThreeLoss(row, key, field) {
      let msg = /^(?:[1-9]\d*|0)(?:\.\d+)?$/
      // if (field == "price") {
      if (msg.test(Number(row[field]))) {
        if (Number(row[field]) >= 0) {
          let _value = row[field].toString().match(/^\d+(?:\.\d{0,2})?/)[0];
          row[field] = _value
        } else {
          row[field] = ""
        }
      } else {
        row[field] = ""
      }
      // }

    },

    valid() {
      return new Promise((resolve, reject) => {
        this.$refs.ruleForm.validate((valid) => {
          resolve(valid);
        });
      })
    },
    handleClearValidate(str) {
      this.$refs.ruleForm.clearValidate(str);
    },

  },
};
</script>

<style lang="scss" scoped>
@import "@/styles/cwgd/formScss.scss";

.decoration-illustrate {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}


::v-deep .header-class {
  .cell::before {
    content: "*";
    color: red;
    padding-right: 2px;
    font-size: 14px;
  }
}

</style>


